<@app.html>
    <@app.head>
    <script>
        var chart;
        var data = [];
        $(function () {
            chart = new Highcharts.Chart({
                //常规图表选项设置
                chart: {
                    renderTo: 'container',        //在哪个区域呈现，对应HTML中的一个元素ID
                    plotBackgroundColor: null,    //绘图区的背景颜色
                    plotBorderWidth: null,        //绘图区边框宽度
                    plotShadow: false            //绘图区是否显示阴影
                },
                title: {
                    text: '今日终端总换电订单'
                },
                tooltip: {
                    pointFormat: '订单数: <b>{point.y}</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        }
                    }
                },
                series: [{
                    type: 'pie',
                    name: '所占比例',
                }]
            });
            $.post("${contextPath}/security/hdw/report/page.htm?flag=${flag}&statsDate=${statsDate}", function (json) {
                if (json.success == 1) {
                    $.each(json.rows, function (index, value) {
                        data.push([value.cabinetId, value.orderCount]);
                    })
                    chart.series[0].setData(data);
                }
            }, 'json');
            $('#page_table').datagrid({
                fit: true,
                pagination: true,
                striped: true,
                url: "${contextPath}/security/hdw/report/page.htm?flag=${flag}&statsDate=${statsDate}",
                fitColumns: true,
                idField: 'cabinetId',
                singleSelect: true,
                selectOnCheck: false,
                checkOnSelect: false,
                autoRowHeight: false,
                rowStyler: gridRowStyler,
                columns: [
                    [
                        {
                            title: '换电柜',
                            align: 'center',
                            field: 'cabinetId',
                            width: 60
                        },
                        {
                            title: '日期',
                            align: 'center',
                            field: 'statsDate',
                            width: 60
                        },
                        {
                            title: '总收入',
                            align: 'center',
                            field: 'money',
                            width: 60,
                            formatter: function (val, row) {
                                return new Number(val / 100).toFixed(2);
                            }
                        },
                        {
                            title: '订单数',
                            align: 'center',
                            field: 'orderCount',
                            width: 60
                        }
                    ]
                ],
                onLoadSuccess: function () {
                    $('#page_table').datagrid('clearChecked');
                    $('#page_table').datagrid('clearSelections');
                }
            });
        });
    </script>
    </@app.head>
    <@app.body>

        <@app.container>
            <@app.banner/>
        <div class="main">
            <@app.menu/>
            <div class="content index_con">
                <div class="panel index_today_wrap">
                    <div class="toolbar clearfix">
                        <div class="float_right">
                            更新时间：<#if updateTime!=''>${updateTime}<#else>${.now}</#if>
                        </div>
                        <h3>每日动态</h3>
                    </div>
                    <div class="index_today">
                        <ul class="clearfix">
                            <li>
                                <div class="yellow"><strong>${totalPrice}</strong>

                                    <p>今日收入</p></div>
                            </li>
                            <li>
                                <div class="green"><strong>${totalNumber}</strong>

                                    <p>今日订单</p></div>
                            </li>
                            <li>
                                <div class="blue">
                                    <a href="${contextPath}/security/basic/passport/index.htm?time=1">
                                        <div class="white">
                                            <strong>${totalNewPassport}</strong>
                                            <p>今日新增客户</p>
                                        </div>
                                    </a>
                                </div>
                            </li>
                            <li>
                                <div class="red">
                                 <!-- 问题电池 默认查询故障电池 在业务上校验是否为null，如果为null者为0-->
                                    <a href="${contextPath}/security/hdw/battery/index.htm?healthy=1">
                                        <div class="float_left" style="margin-left:80px">
                                            <strong>${totalFaultBattery}</strong>
                                            <p>故障电池</p>
                                        </div>
                                    </a>
                                    <a href="${contextPath}/security/hdw/battery/index.htm?healthy=2">
                                        <div class="float_right" style="margin-right:80px">
                                            <strong>${totalAbnormalBattery}</strong>
                                            <p>异常电池</p>
                                        </div>
                                    </a>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div id="divSecond" class="panel">
                    <div class="toolbar clearfix">
                        <div class="float_right">
                            更新时间： <#if updateTime!=''>${updateTime}<#else>${.now}</#if>
                        </div>
                        <h3>终端图表</h3>
                    </div>
                    <div style="padding-left:600px;height:400px;">
                        <div id="container" style="float:left;width:600px;margin-left:-600px;"></div>
                        <div style="padding: 0px 30px 30px 0px;float:right;height:400px;width:100%; ">
                            <table id="page_table"></table>
                        </div>
                    </div>
                </div>
                <#if Session['SESSION_KEY_USER'].type != Session['USER_TYPE_PLATFORM'].value>
                    <div class="panel index_ent_wrap">
                        <div class="toolbar clearfix">
                            <div class="float_right"></div>
                            <#if Session['SESSION_KEY_USER'].type == Session['USER_TYPE_AGENT'].value>
                                <h3>运营商信息</h3>
                            <#elseif Session['SESSION_KEY_USER'].type == Session['USER_TYPE_AGENCY'].value>
                                <h3>代理商信息</h3>
                            <#elseif Session['SESSION_KEY_USER'].type == Session['USER_TYPE_SUPPLIER'].value>
                                <h3>厂商信息</h3>
                            </#if>
                        </div>
                        <div class="index_ent">
                            <ul class="clearfix">
                                <li>
                                    <table>
                                        <tr>
                                            <td align="right" width="70">名称：</td>
                                            <td>${Session['SESSION_KEY_USER'].agentName}</td>
                                        </tr>
                                        <tr>
                                            <td align="right">备注：</td>
                                            <td>${Session['SESSION_KEY_USER'].memo}</td>
                                        </tr>
                                    </table>
                                </li>
                                <li>
                                    <table>
                                        <tr>
                                            <td align="right" width="70">联系电话：</td>
                                            <td>${Session['SESSION_KEY_USER'].tel}</td>
                                        </tr>
                                    </table>
                                </li>
                            </ul>
                        </div>
                    </div>
                </#if>
            </div>
        </div>
        </@app.container>
    </@app.body>
</@app.html>
